﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Power Point Slide</title>
    <meta charset="utf-8" />
    <style>
        ul{
            list-style-type:none;
            
        }

        li:before{
            content:'\25A0';
            position:relative;
            display:block;
            max-height:0px;
            max-width:0px;
            left:-10px;
            bottom:2px;
            color:#F3BE60;
        }

        .orange{
            color:#F3BE60;
        }

        li{
            color:#FBEEC9;
        }

        .internal-wrapper{
           width:1100px;
           border: 3px solid skyblue;
           margin:20px;
        }

        #wrapper{
            background-image:url("images/Layout.jpg")
        }
    </style>
</head>
<body>
    <div id="wrapper">
        <h1 class="orange">Headings and Paragraphs</h1>
        <ul>
            <li>
                Heading Tags: &lt; <span class="orange">h1 &gt; &ndash; &lt; h6 &gt;</span>
                <div class="internal-wrapper">
                    <div>&lt; h1 &gt; Heading 1 &lt; &frasl;h1 &gt;</div>
                    <div>&lt; h2 &gt; Sub heading 2 &lt; &frasl;h2 &gt;</div>
                    <div>&lt; h3 &gt; Sub heading 3 &lt; &frasl;h3 &gt;</div>
                </div>
            </li>
            <li>
                Paragraph Tags: <span class="orange"> &lt; p &gt;</span>
                <div class="internal-wrapper">
                    <div>&lt; p &gt; This is my first paragraph &lt; &frasl; p &gt;</div>
                    <div>&lt; p &gt; This is my second paragraph &lt; &frasl; p &gt;</div>
                </div>
            </li>
            <li>
                Sections: <span class="orange">&lt; div &gt;</span> and <span class="orange">&lt; span &gt;</span>
                <div class="internal-wrapper">
                    <div>&lt; div style= "background: skyblue;" &gt; </div>
                    <div>This is a div</div>
                    <div>&lt; &frasl; div &gt;</div>
                </div>
            </li>
        </ul>
    </div>
    
</body>
</html>
